<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <style>
			div {
				width: 200px;
				height: 250px;
				margin: 200px auto;
				position: relative;
			}
			div img {
				position: absolute;
				top: 0;
				left: 0;
				transition: all 5s;
			}
			div img:first-child {
				z-index: 1;/* 要加这个 */
				backface-visibility: hidden;
			}
			div:hover img {
				transform: rotateY(180deg);
			}
        </style>
    </head>
    <body>
    <div>
    <img src="images/2.jpg" alt="">
    <img src="images/1.jpg" alt="">
    </div>
    </body>
</html>